import React,{Component} from 'react'
import { Table,Space,Button,Modal,Form, Input, message,Select,DatePicker} from 'antd';
import {reqAdmingetAllMessage,reqBreakAllMessage,reqCheckAllCollege,reqRemovePerson,reqAddMemberList,reqDeleteMemberList} from '../../api/index'
import 'moment/locale/zh-cn';
import locale from 'antd/es/date-picker/locale/zh_CN'
import './index.less'

class AdminMessage extends React.Component{
    constructor(props){
        super(props)
        this.state = {
            visible:false,
            visible1:false,
            visible2:false,
            visible3:false,
            visible4:false,
            data1:[],
            data2:[],
            roomState:null,
            shelfState:null,
            goodsId:null,
            kuGoodsId:null,
            collegeList:[],
            goodsInfoFormList:[],
            applicationTime:null,
        }
        this.handleCancel = this.handleCancel.bind(this)
        this.handleClikk = this.handleClikk.bind(this)
        this.handleBreak = this.handleBreak.bind(this)
        this.handleNewPerson = this.handleNewPerson.bind(this)
    }
    
    componentDidMount(){
        reqAdmingetAllMessage().then(res=>{
            console.log(res)
            this.setState({data1:res.data})
        })
        reqCheckAllCollege().then(res=>{
          this.setState({collegeList:res.data})
        })
    }
    handleNewPerson(e){
      this.setState({kuGoodsId:e.goodsId})
      this.setState({visible2:true})
    }
    handleBreak(e){
      this.setState({goodsId:e.goodsId})
      this.setState({visible1:true})
    }
    
    handleChange=(value)=> {
      console.log(`selected ${value}`);
    }
    addMemberMessage=(values)=>{/*添加 信息*/ 
      console.log(values)
      let FormDatas = {
        agentName:values.agentName,
        agentPhone:values.agentPhone,
        applicationTime:this.state.applicationTime,
        chargeName: values.chargeName,
        chargePhone: values.chargePhone,
        college: values.college,
        roomNumber:values.roomNumber,
        shelfNumber:values.shelfNumber,
        goodsInfoFormList:this.state.goodsInfoFormList
      }
      // let app={applicationTime:this.state.applicationTime}
      let goodsData = JSON.stringify(FormDatas)
      console.log(goodsData)
      reqAddMemberList(goodsData).then(res=>{
        console.log(res)
        if(res.code === 0){
          reqAdmingetAllMessage().then(res=>{
            console.log(res)
            this.setState({data1:res.data})
        })
          this.setState({visible3:false})
          message.success('添加库存信息成功！')
        }else{
          message.error('添加库存信息失败！')
        }
      })
    }
    handleCancel(){
        console.log('Clicked cancel button');
        this.setState({visible:false});
        this.setState({visible1:false});
        this.setState({visible2:false});
        this.setState({visible3:false});
      };
      handleCancel1=()=>{
        console.log('Clicked cancel button');
        this.setState({visible4:false});
      };
      onFinish = (values) => {
        console.log('Success:', values);
        const needValue = {
          goodsId:this.state.goodsId,
          shelfNumber:values.shelfNumber,
          roomNumber:values.roomNumber
        }
        reqBreakAllMessage(needValue).then(res=>{
          if(res.code === 0){
            reqAdmingetAllMessage().then(res=>{
              console.log(res)
              this.setState({data1:res.data})
          })
          this.setState({visible1:false})
          message.success('修改库存信息成功！')
          }else{
            message.error('库存更新失败！')
          }
        })
      };
      // handleOnpushGoods = ()=>{
      //   this.setState({visible4:true})
      // }
      dateonChange=(date)=>{
        console.log(typeof date._d.toString())
        this.setState({applicationTime:date._d})
      }
      onFinish2 = (values)=>{//修改负责人信息
        const needValue = {
          chargeName:values.chargeName,
          chargePhone:values.chargeNumber,
          college:values.college,
          goodsId:this.state.kuGoodsId
        }
        reqRemovePerson(needValue).then(res=>{
          if(res.code === 0){
            reqAdmingetAllMessage().then(res=>{
              console.log(res)
              this.setState({data1:res.data})
          })
          }
          message.success('修改负责人信息成功！')
          this.setState({visible2:false})
        })
      }
      onFinishFailed = (errorInfo) => {
        console.log('Failed:', errorInfo);
      };
      onPushGoods = (values)=>{
        console.log(values);
        let goodsInfoFormList = [];
        if(values.goodsName1 !== undefined){
          let goods1 = {
            goodsName:values.goodsName1,
            goodsNum:values.goodsNum1,
            goodsWeight:values.goodsWeight1,
          }
          goodsInfoFormList.push(goods1)
        }
        if(values.goodsName2 !== undefined){
          let goods2 = {
            goodsName:values.goodsName2,
            goodsNum:values.goodsNum2,
            goodsWeight:values.goodsWeight2,
          }
          goodsInfoFormList.push(goods2)
        }
        if(values.goodsName3 !== undefined){
          let goods3 = {
            goodsName:values.goodsName3,
            goodsNum:values.goodsNum3,
            goodsWeight:values.goodsWeight3,
          }
          goodsInfoFormList.push(goods3)
        }
        if(values.goodsName4 !== undefined){
          let goods4 = {
            goodsName:values.goodsName4,
            goodsNum:values.goodsNum4,
            goodsWeight:values.goodsWeight4,
          }
          goodsInfoFormList.push(goods4)
        }
        console.log(goodsInfoFormList)
        this.setState({goodsInfoFormList:goodsInfoFormList})
        this.setState({visible4:false})
      }
    handleClikk(e){
    console.log(e.goodsId)
    this.setState({data2:[]})
    reqAdmingetAllMessage().then(res=>{
        console.log(res)//对数据进行处理然后展示
        res.data.map((item,index)=>{
        if(item.goodsId === e.goodsId){
            this.setState({data2:item.goodsInfoList})
        }
        })
    })
    this.setState({visible:true});
    }
    handleOkAddMessage = ()=>{
      this.setState({visible3:true})
    }
    ModalPush = () =>{
      this.setState({visible4:true})
    }
    handleDeleteGoods = (e) =>{
      reqDeleteMemberList(e).then(res=>{
        console.log(res)
        if(res.code === 0){
          reqAdmingetAllMessage().then(res=>{
            console.log(res)
            this.setState({data1:res.data})
        })
          this.setState({visible:false})
          message.success('删除物品成功！')
        }else{
          message.error('删除物品失败！')
        }
      })
    }
    render(){
        const columns2 = [
          {
            title: '物品ID',
            dataIndex: 'goodsInfoId',
            key: 'goodsInfoId',
            render: text => <a>{text}</a>,
          },
            {
              title: '物品名称',
              dataIndex: 'goodsName',
              key: 'goodsName',
            },
            {
              title: '物品数量',
              dataIndex: 'goodsNum',
              key: 'goodsNum',
            },
            {
              title: '物品规格(L/kg)',
              dataIndex: 'goodsWeight',
              key: 'goodsWeight',
            },
            {
              title: '操作',
              key: 'action',
              render: (text, record) => (
                <Space size="middle">
                  <Button onClick={()=>{
                    // this.setState({roomState:record.roomNumber})
                    // this.setState({shelfState:record.shelfNumber})
                      const param = {
                        goodsInfoId:record.goodsInfoId,
                      }
                      this.handleDeleteGoods(param)
                  }} type='danger'>删除</Button>
                </Space>
              ),
            },
          ];
          const columns1 = [
              {
                title: '物品ID',
                dataIndex: 'goodsId',
                key: 'goodsId',
                render: text => <a>{text}</a>,
              },
              {
                title: '经办人姓名',
                dataIndex: 'agentName',
                key: 'agentName',
              },
              {
                title: '经办人电话',
                dataIndex: 'agentPhone',
                key: 'agentPhone',
              },
              {
                title: '负责人姓名',
                dataIndex: 'chargeName',
                key: 'chargeName',
              },
              {
                title: '负责人电话',
                dataIndex: 'chargePhone',
                key: 'chargePhone',
              },
              {
                title:'所在院',
                dataIndex: 'college',
                key: 'college',
              },
              {
                title:'房间号',
                dataIndex: 'roomNumber',
                key: 'roomNumber',
              },
              {
                title:'货架号',
                dataIndex: 'shelfNumber',
                key: 'shelfNumber',
              },
              {
                title: '查看',
                key: 'action',
                render: (text, record) => (
                  <Space size="middle">
                    <Button onClick={()=>{
                      // this.setState({roomState:record.roomNumber})
                      // this.setState({shelfState:record.shelfNumber})
                        const param = {
                          goodsId:record.goodsId,
                        }
                        this.handleClikk(param)
                    }} type='primary'>查看详情</Button>
                  </Space>
                ),
              },
              {//管理员修改存储信息
                title: '修改',
                key: 'action',
                render: (text, record) => (
                  <Space size="middle">
                    <Button onClick={()=>{
                        const param = {
                          goodsId:record.goodsId,
                        }
                        this.handleBreak(param)
                    }} type='primary'>存储位置</Button>
                    <Button onClick={()=>{
                        const param = {
                          goodsId:record.goodsId,
                        }
                        this.handleNewPerson(param)
                    }} type='primary'>负责人</Button>
                  </Space>
                ),
              },
            ];
           
            const data1 = this.state.data1;
            const data2 = this.state.data2
            const layout = {
              labelCol: {
                span: 8,
              },
              wrapperCol: {
                span: 16,
              },
            };
            const { Option } = Select;
            const optionList = this.state.collegeList
        return(<>
        <Button type='primary' onClick={this.handleOkAddMessage}>添加库存信息</Button>
        <Table className="tableOne" columns={columns1} dataSource={data1} />
        <Modal
          title="危险品详情"
          visible={this.state.visible}
          onCancel={this.handleCancel}
          footer=''
        >
          <Table className="tableOne" columns={columns2} dataSource={data2} />
        </Modal>
        <Modal
          title="修改库房存储位置"
          visible={this.state.visible1}
          onCancel={this.handleCancel}
          footer=''
        >
          <Form
      name="basic"
      labelCol={{
        span: 7,
      }}
      wrapperCol={{
        span: 13,
      }}
      initialValues={{
        remember: true,
      }}
      onFinish={this.onFinish}
      onFinishFailed={this.onFinishFailed}
      autoComplete="off"
    >
      <Form.Item
        label="房间号"
        name="roomNumber"
      >
        <Input />
      </Form.Item>

      <Form.Item
        label="货架号"
        name="shelfNumber"
      >
        <Input/>
      </Form.Item>

      <Form.Item
        wrapperCol={{
          offset: 8,
          span: 16,
        }}
      >
        <Button type="primary" htmlType="submit">
          确认修改
        </Button>
      </Form.Item>
    </Form>
        </Modal>
        <Modal
          title="修改负责人信息"
          visible={this.state.visible2}
          onCancel={this.handleCancel}
          footer=''
        >
          <Form
      name="basic"
      labelCol={{
        span: 7,
      }}
      wrapperCol={{
        span: 13,
      }}
      initialValues={{
        remember: true,
      }}
      onFinish={this.onFinish2}
      onFinishFailed={this.onFinishFailed}
      autoComplete="off"
    >
      <Form.Item
        label="负责人姓名"
        name="chargeName"
      >
        <Input />
      </Form.Item>

      <Form.Item
        label="负责人电话"
        name="chargeNumber"
      >
        <Input/>
      </Form.Item>
      
      <Form.Item
        label="学院"
        name="college"
      >
        <Select defaultValue="请选择学院名称" style={{ width: 260 }} onChange={this.handleChange}>
        {optionList.map((item,index)=>{
              return (
                <Option value={item.text}>{item.text}</Option>
              )
            })}
        </Select>
      </Form.Item>

      <Form.Item
        wrapperCol={{
          offset: 8,
          span: 16,
        }}
      >
        <Button type="primary" htmlType="submit">
          确认修改
        </Button>
      </Form.Item>
    </Form>
        </Modal>
        {/*添加物品成员*/}
        <Modal
          title="添加库存信息"
          visible={this.state.visible3}
          onCancel={this.handleCancel}
          footer=''
        >
          <Form
      name="basic"
      labelCol={{
        span: 7,
      }}
      wrapperCol={{
        span: 13,
      }}
      initialValues={{
        remember: true,
      }}
      onFinish={this.addMemberMessage}
      onFinishFailed={this.onFinishFailed}
      autoComplete="off"
    >
     <Button type='primary' style={{marginLeft:150,marginBottom:20}}  onClick={this.ModalPush}>点击填写物品信息</Button>
      <Form.Item
        label="申请时间"
        name="applicationTime"
        required
      >
        <DatePicker locale={locale} onChange={this.dateonChange} />
      </Form.Item>
      <Form.Item
        label="负责人姓名"
        name="chargeName"
        required
      >
        <Input />
      </Form.Item>

      <Form.Item
        label="负责人电话"
        name="chargePhone"
        required
      >
        <Input/>
      </Form.Item>
      <Form.Item
        label="经办人姓名"
        name="agentName"
        required
      >
        <Input/>
      </Form.Item>
      <Form.Item
        label="经办人电话"
        name="agentPhone"
        required
      >
        <Input/>
      </Form.Item>
      
      <Form.Item
        label="学院"
        name="college"
        required
      >
        <Select defaultValue="请选择学院名称" style={{ width: 260 }} onChange={this.handleChange}>
        {optionList.map((item,index)=>{
              return (
                <Option value={item.text}>{item.text}</Option>
              )
            })}
        </Select>
      </Form.Item>
      <Form.Item
        label="货架号"
        name="shelfNumber"
        required
      >
        <Input/>
      </Form.Item>
      <Form.Item
        label="房间号"
        name="roomNumber"
        required
      >
        <Input/>
      </Form.Item>
      <Form.Item
        wrapperCol={{
          offset: 8,
          span: 16,
        }}
      >
        <Button type="primary" htmlType="submit">
          确定
        </Button>
      </Form.Item>
    </Form>
        </Modal>
        {/*添加物品*/}
        <Modal
          title="添加物品信息"
          visible={this.state.visible4}
          onCancel={this.handleCancel1}
          footer=''
        >
          <Form
      name="basic"
      labelCol={{
        span: 7,
      }}
      wrapperCol={{
        span: 13,
      }}
      initialValues={{
        remember: true,
      }}
      onFinish={this.onPushGoods}
      onFinishFailed={this.onFinishFailed}
      autoComplete="off"
    >
     <div className="FormStyle">
     <Form.Item
        label="物品名称"
        name="goodsName1"
        required
      >
        <Input />
      </Form.Item>
      <Form.Item
        label="物品数量"
        name="goodsNum1"
        required
      >
        <Input />
      </Form.Item>

      <Form.Item
        label="规格型号"
        name="goodsWeight1"
        required
      >
        <Input/>
      </Form.Item>
     </div>
     <div className="FormStyle">
     <Form.Item
        label="物品名称"
        name="goodsName2"
        required
      >
        <Input />
      </Form.Item>
      <Form.Item
        label="物品数量"
        name="goodsNum2"
        required
      >
        <Input />
      </Form.Item>

      <Form.Item
        label="规格型号"
        name="goodsWeight2"
        required
      >
        <Input/>
      </Form.Item>
     </div>
     <div className="FormStyle">
     <Form.Item
        label="物品名称"
        name="goodsName3"
        required
      >
        <Input />
      </Form.Item>
      <Form.Item
        label="物品数量"
        name="goodsNum3"
        required
      >
        <Input />
      </Form.Item>

      <Form.Item
        label="规格型号"
        name="goodsWeight3"
        required
      >
        <Input/>
      </Form.Item>
     </div>
     <div className="FormStyle">
     <Form.Item
        label="物品名称"
        name="goodsName4"
        required
      >
        <Input />
      </Form.Item>
      <Form.Item
        label="物品数量"
        name="goodsNum4"
        required
      >
        <Input />
      </Form.Item>

      <Form.Item
        label="规格型号"
        name="goodsWeight4"
        required
      >
        <Input/>
      </Form.Item>
     </div>
      
      
      <Form.Item
        wrapperCol={{
          offset: 8,
          span: 16,
        }}
      >
        <Button type="primary" htmlType="submit">
          确定
        </Button>
      </Form.Item>
    </Form>
        </Modal>
        </>)
    }
}
export default AdminMessage

